{{define "main"}}
<!DOCTYPE html>
<html>
<head>
  <link rel="shortcut icon" href="/static/img/prometheus-ico.png" />
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <link href="/static/css/bootstrap.min.css" rel="stylesheet" />
  <link href="/static/css/docs.css" rel="stylesheet" />
  <style>
	  #myBtn {
	  display: none;
	  position: fixed;
	  right: 5px;
	  top: 70%;
	  z-index: 99;
	  border: none;
	  outline: none;
	  cursor: pointer;
	  padding: 12px;
	  border-radius: 18px;
	  background-color:rgba(255,255,255,.15);
	  border-color:#4cae4c;
	  }
	  #myBtn:hover {
	  background-color:#f9f9f9;
	  border-color:#eea236;
	  }
  </style>
{{end}}

{{define "head"}}
<div class="navbar navbar-static-top bs-docs-nav">
  <div class="container">
  <a class="navbar-brand" href="#">
    <img alt="Brand" width="20" height="20" src="/static/img/prometheus-ico.png">
  </a>
  <a class="navbar-brand"  href="/">PrometheusAlert</a>
    <ul class="nav nav-tabs">
      <li role="presentation" {{if .IsIndex}}class="active"{{end}}><a href="/">Index</a></li>
      <li role="presentation" {{if .IsTest}}class="active"{{end}}><a href="/test">Test</a></li>
      <li role="presentation" {{if .IsTemplate}}class="active"{{end}}><a href="/template">AlertTemplate</a></li>
      <li role="presentation" {{if .IsSilences}}class="active"{{end}}><a href="javascript:if(confirm('即将上线，敬请期待......'))location='/'">Silences</a></li>
      <li role="presentation" {{if .IsSetup}}class="active"{{end}}><a href="javascript:if(confirm('即将上线，敬请期待......'))location='/'">Setup</a></li>
      <li role="presentation"><a href="https://feiyu563.github.io/">Help</a></li>
      {{if .IsLogin}}
      <!--<li role="presentation" class="navbar-right"><a href="/login?exit=true"><span class="glyphicon glyphicon-off"></span></a></li>-->
      {{else}}
      <!--<li role="presentation" class="navbar-right"><a href="/login"><span class="glyphicon glyphicon-user"></span></a></li>-->
      {{end}}
    </ul>
  </div>
</div>
{{end}}

{{define "endhtml"}}
<script type="text/javascript" src="/static/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
<div class="container">
	<button onclick="topFunction()" id="myBtn"><span class="glyphicon glyphicon-plane"></span><p>返回顶部</p></button>
	<script>
	// 当网页向下滑动 20px 出现"返回顶部" 按钮
	window.onscroll = function() {scrollFunction()};

	function scrollFunction() {console.log(121);
	if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
	document.getElementById("myBtn").style.display = "block";
	} else {
	document.getElementById("myBtn").style.display = "none";
	}
	}

	// 点击按钮，返回顶部
	function topFunction() {
	document.body.scrollTop = 0;
	document.documentElement.scrollTop = 0;
	}
	</script>
	
</div>

<div class="bs-docs-footer">

	<div class="container">
		
		<p>Designed and built with all the love in the world by jikun.zhang</p>

		<p>PrometheusAlert</p>

	  </div>
</div>

</body>
</html>
{{end}}